<!DOCTYPE html>
<html lang="zh-CN" style="height: 100%;">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>登录WeStore</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link rel="icon" type="image/png" href="img/favicon/cloud.png" sizes="23x16">
    <style type="text/css">
        .error {
            color: red;
        }
    </style>
</head>
<body style="height: 100%;">
<div class="container-fluid" style="height: 100%;">
    <div class="row" style="margin-top:8%;">
        <div class="col-md-4 col-md-offset-4">
            <h2 style="text-align: center;">代驾APP后台管理系统</h2>
            <br/>
            <br/>
            <div class="form-group">
                <input type="text" class="form-control" id="userAccount" placeholder="账户">
                <br/>
                <input type="password" class="form-control" id="passWord" placeholder="密码">
            </div>

            <br/>

            <button class="btn btn-primary col-md-12" id="btn_login">登录</button>
            <p class="error"></p>
        </div>
    </div>
</div>

<!-- 警告模态框 -->
<div class="modal fade bs-example-modal-sm" id="loginWarnModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">错误信息提示</h4>
            </div>
            <div class="modal-body">
                <p style="color: #d43f3a"><b>用户名不存在或者密码错误！<br/>
                    请仔细检查后重新输入！</b></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.cookie.js"></script>

<script>
    $(document).ready(function () {
        var loginPath="/manager/login";
        $("#btn_login").click(function () {
            $.ajax({
                type: "POST",
                url: "/manager/login",
                contentType: "application/json",
                data: JSON.stringify(getUser()),
                statusCode: {
                    404: function () {
                        $(".error").text("登录失败，用户名不存在");
                    },
                    401: function () {
                        $(".error").text("登录失败，密码不正确");
                    }
                },
                success: function (result) {
                    // console.log("status:"+result.status);
                    // //设置cookie
                    // $.cookie("userId",result.userId);
                    // $.cookie("token",result.token);
                    // //设置token
                    // sessionStorage.setItem("token",result.token);
                    // sessionStorage.setItem("userId",result.userId);

                    if(result.status==0){
                        sessionStorage.setItem("account", $("#userAccount").val());
                        window.location.href = "/managerHome";
                    }else{
                        if(result.status==1){
                            //账户不存在
                            console.log("登录失败，用户名不存在！");
                        }else{
                            //密码错误
                            console.log("登录失败，密码错误！");
                        }
                        $("#loginWarnModal").modal('show');
                    }
                }
            });
        });

        function getUser() {
            var user = {
                account: $("#userAccount").val(),
                passWord: $("#passWord").val()
            };
            return user;
        }
    });
</script>
</body>
</html>